<template>
	<el-dialog
		v-model="state.visible"
		title="操作记录"
		width="60%"
		top="100px"
		draggable
		overflow
		:close-on-click-modal="false"
		:before-close="handleClose"
	>
		<div>
			<el-space wrap>
				<div class="search-info-box">
					<el-text class="search-info" size="small" type="info">选择时间</el-text>
					<el-date-picker
						v-model="state.dateTime"
						size="small"
						:shortcuts="shortcuts"
						format="YYYY-MM"
						value-format="YYYY-MM-DD HH:mm:ss"
						:default-time="defaultTime"
						type="daterange"
						range-separator="~"
						start-placeholder="开始时间"
						end-placeholder="结束时间"
						style="width: 200px; padding-left: 60px"
						:clearable="false"
					/>
				</div>
				<div class="search-info-box">
					<el-text class="search-info" size="small" type="info">操作人</el-text>
					<el-input size="small" style="width: 200px" v-model.trim="state.search.user" clearable maxlength="100" />
				</div>
				<el-button type="primary" size="small" @click="onSearch">查询</el-button>
			</el-space>

			<div class="table">
				<el-table ref="tblRef" :data="state.dataList" border v-loading="state.loading" height="500px" max-height="500px" @sort-change="filter">
					<el-table-column prop="createTime" label="时间" show-overflow-tooltip />
					<el-table-column label="操作内容" prop="remark" show-overflow-tooltip />
					<el-table-column prop="createName" label="操作人" />
				</el-table>

				<div class="page">
					<el-pagination
						small
						v-model:current-page="state.search.pageIndex"
						v-model:page-size="state.search.pageSize"
						:page-sizes="[50, 100, 300]"
						background
						layout="total,sizes, prev, pager, next"
						:total="state.total"
						@size-change="getData"
						@current-change="getData"
					/>
				</div>
			</div>
		</div>
		<template #footer>
			<el-button size="small" type="primary" @click="handleClose">关闭</el-button>
		</template>
	</el-dialog>
</template>
    
    <script setup>
import { reactive } from 'vue'
//   import { GetVisitConfigLog } from '@/common/api/hardware/employee.ts'
// import {  } from "";
const state = reactive({
	visible: false,
	search: {
		user: '',
		pageIndex: 1,
		pageSize: 50
	},

	total: 0,
	dataList: []
})

const open = async () => {
	// await getData()
	state.visible = true
}
const handleClose = () => {
	state.visible = false
}
const onSearch = () => {}
//   const getData = async () => {
//     const res = await GetVisitConfigLog(state.search)
//     if (res.code === 1) {
//       state.dataList = res.data
//       state.total = res.total
//       } else {
//       ElMessage.error(res.message)
//     }
//   }
defineExpose({
	open
})
</script>
    
    <style scoped lang='scss'>
.table {
	.page {
		display: flex;
		justify-content: flex-end;
		margin-top: 10px;
	}
}
</style>